<!-- 显示等级组件 -->
<!-- 小瓜子 更新于2020.8.18 -->
<template>
	<view class="level" :style="'background-color: ' + backgroundColors[level - 1]">
		Lv{{level}}
	</view>
</template>

<script>
	export default {
		props: {
			level: {
				type: Number,
				default: 0
			}
		},
		data() {
			return {
				backgroundColors: [
					'#2196F3',
					'#FEC107',
					'#ff8300',
					'#F76B8A',
					'#ee6644',
					'#FF2233',
				]
			}
		}
	}
</script>

<style lang="less">
	@import url("../common/g-style.less");
	.level {
		width: 34px;
		height: 14px;
		color: #FFFFFF;
		font-size: 10px;
		// background-color: @g-pink;
		border-radius: 7px;
		text-align: center;
		line-height: 14px;
	}
</style>
